<include file="Public/head" />
<style type="text/css">
    .focus-btn{width:80px;border-radius: 3px;color: #fff;margin-left: 7px;padding: 0;background-color: #20ab4f;border: medium none;}
    .carousel table tr td{height:40px;line-height:40px;text-align:left;}
    .carousel_sub{}
    .carousel_sub input{ background: #20ab4f; border: 1px solid #20ab4f;border-radius: 3px;color: #fff;cursor: pointer;
                         font-size: 14px;height: 30px;line-height: 30px;margin: 30px 10px;text-align: center;width: 170px;}
    .genghua {background: #20ab4f;border: medium none;
              border-radius: 4px;color: #fff;cursor: pointer; display: inline-block;height: 30px;
              line-height: 30px;width: 100px; margin-left:-105px;}
    .shangChuan { cursor: pointer; height: 30px;opacity: 0; width: 100px;}
    .shangChuan1 { cursor: pointer; height: 30px;opacity: 0; width: 100px;}
    .edit_page,.confirm_page{border:1px solid #ececec;}

    #sort-list ul li {float:left;margin-left:10px;}
    #sort-list ul li span{display:block;width:30px;height:30px;line-height:30px;border:1px solid #ececec;text-align:center;cursor:pointer;}
    .sortCuur {background-color:#20ab4f;color:#fff;border:1px solid #20ab4f;}
    .isHave{background-color:#ececec;}
</style>
</head>
<include file="Public/common_header" />
<div class="mian">
    <include file="Public/sidebar"  menu="nrgl.jdtgl" />

    <div class="mianR">
        <div class="edit_page">
            <h3 class="cha">编辑焦点图</h3>
            <div class='carousel'>
                <table width="100%">
                    <tr>
                        <td style="text-align:center">标题</td>
                        <td style="padding:5px 10px;">
                            <input type="text" name="title"  value="{$carousel.remark}" placeholder="请输入标题" style="width:300px;height:30px;line-height:30px;border:1px solid #ededee;padding-left:5px;">
                        </td>
                    </tr>
                    <tr>
                        <td width="10%" style="text-align:center">图片</td>
                        <td width="80%" style="padding:5px 10px;">
                    <if condition="$carousel.focus_picture eq ''">
                        <img id="carousel_pic" src="">
                        <else />
                        <img id="carousel_pic" src="{$carousel.focus_picture}@182w_82h">
                    </if>
                    <script type='text/javascript'>
                        new IFrameUploadImg(
                                '浏览'
                                , 'http://' + window.location.host + '/Carousel/uploadPic'
                                , function (res) {
                                    var cdn_url = 'http:{$t|get_content_cdnurl}';
                                    if (res.code == 200) {
                                        var head_url = res.data[0];
                                        $('#carousel_pic').attr('src', cdn_url + head_url + '@182w_82h_90Q.jpg');
                                        $('#confirm_carousel_pic').attr('src', cdn_url + head_url + '@182w_82h_90Q.jpg');
                                        $('#true_carousel_pic').attr('src', cdn_url + head_url);
                                    }
                                });
                    </script>
                    <!--<input type="file" name="focus_picture">-->
                    </td>
                    </tr>
                    <tr>
                        <td style="text-align:center">类型</td>
                        <td style="padding:5px 10px;">
                            <input type="radio" name="type" value="2" class="type_item" <?php echo $carousel['type']==2?'checked':'';?>>活动
                            <input type="radio" name="type" value="1" class="type_item" <?php echo $carousel['type']==1?'checked':'';?>>拍卖
                            <input type="radio" name="type" value="3" class="type_item" <?php echo $carousel['type']==3?'checked':'';?>>图片
                    <!--<if condition="$carousel.type eq 1">-->
                        <!--<input type="radio" name="type" value="2" class="type_item">活动-->
                        <!--<if condition="$platform eq 1">-->
                            <!--<input type="radio" name="type" value="1" class="type_item"  checked>拍卖-->
                        <!--</if>-->
                        <!--<input type="radio" name="type" value="3" class="type_item">图片-->
                        <!--<elseif condition="$carousel.type eq 2" />-->
                        <!--<input type="radio" name="type" value="2" class="type_item" checked>活动-->
                        <!--<if condition="$platform eq 1">-->
                            <!--<input type="radio" name="type" value="1" class="type_item">拍卖-->
                        <!--</if>-->
                        <!--<input type="radio" name="type" value="3" class="type_item">图片-->
                        <!--<elseif condition="$carousel.type eq 3" />-->
                        <!--<input type="radio" name="type" value="2" class="type_item">活动-->
                        <!--<if condition="$platform eq 1">-->
                        <!--<input type="radio" name="type" value="1" class="type_item">拍卖-->
                        <!--</if>-->
                        <!--<input type="radio" name="type" value="3" class="type_item"  checked>图片-->
                    <!--</if>-->
                    </td>
                    </tr>
                    <tr>
                        <td style="text-align:center">是否登录</td>
                        <td id="param_auth" style="padding:5px 10px;">
                            <input type="radio" name="auth" value="1" <?php echo $carousel['auth'] == 1 ? 'checked' : '';?>>是
                            <input type="radio" name="auth" value="2" <?php echo $carousel['auth'] == 2 ? 'checked' : '';?>>否
                        </td>
                    </tr>
                    <tr>
                        <td style="text-align:center">参数</td>
                        <td id="param_url" style="padding:5px 10px;">
                        <if condition="$carousel.type eq 1">
<!--                        <input type="text" name="scene_id" value="{$carousel.scene_id}" placeholder="" style="width:300px;height:30px;line-height:30px;border:1px solid #ededee;padding-left:5px;">
                            <input type="text" name="param_url" value="{$carousel.param_url}" placeholder="请输入以“http://”开头的活动URL" style="width:300px;height:30px;line-height:30px;border:1px solid #ededee;display:none;padding-left:5px;">-->
<!--                            <select name="scene_id" id="scene_sign">
                               <volist  name="scene_list" id="sl">
                                   <option value="{$sl.scene_id}">{$sl.name}</option>
                               </volist>
                           </select>-->
                            <select name="scene_id" id="scene_sign">
                                <foreach name="scene_list" item="sl">
                                    <php>$sceneselected = $carousel['scene_id'] == $sl['scene_id']?"selected":"";</php>
                                    <option value="{$sl.scene_id}"{$sceneselected}>{$sl.name}</option>
                                </foreach>
                            </select>
                           <input type="text" name="param_url" value="{$carousel.param_url}" placeholder="请输入以“http://”开头的活动URL" style="width:300px;height:30px;line-height:30px;border:1px solid #ededee;display:none;padding-left:5px;">
                        <elseif condition="$carousel.type eq 2" />
<!--                            <select name="scene_id" id="scene_sign" style="display:none">
                                <volist  name="scene_list" id="sl">
                                    <option value="{$sl.scene_id}" >{$sl.name}</option>
                                </volist>
                            </select>-->
                            <select name="scene_id" id="scene_sign" style="display:none">
                                <foreach name="scene_list" item="sl">
                                    <php>$sceneselected = $carousel['scene_id'] == $sl['scene_id']?"selected":"";</php>
                                    <option value="{$sl.scene_id}"{$sceneselected}>{$sl.name}</option>
                                </foreach>
                            </select>
                            <!--<input type="text" name="scene_id" value="{$carousel.scene_id}" placeholder="" style="width:300px;height:30px;line-height:30px;border:1px solid #ededee;display:none;">-->
                            <input type="text" name="param_url" value="{$carousel.param_url}" placeholder="请输入以“http://”开头的活动URL" style="width:300px;height:30px;line-height:30px;border:1px solid #ededee;padding-left:5px;">
                        <elseif condition="$carousel.type eq 3" />
                            <select name="scene_id" id="scene_sign" style="display:none">
                                <foreach name="scene_list" item="sl">
                                    <php>$sceneselected = $carousel['scene_id'] == $sl['scene_id']?"selected":"";</php>
                                    <option value="{$sl.scene_id}"{$sceneselected}>{$sl.name}</option>
                                </foreach>
                            </select>
                            <input type="text" name="param_url" value="{$carousel.param_url}" placeholder="请输入以“http://”开头的活动URL" style="width:300px;height:30px;line-height:30px;border:1px solid #ededee;display:none;padding-left:5px;">
                        </if>
                    </td>
                    <td id="scene" style="padding:5px 10px;display:none;">
                       <select name="scene_id" id="scene_sign">
                            <foreach name="scene_list" item="sl">
                                <php>$sceneselected = $carousel['scene_id'] == $sl['scene_id']?"selected":"";</php>
                                <option value="{$sl.scene_id}"{$sceneselected}>{$sl.name}</option>
                            </foreach>
                        </select>
                    </td>
                    </tr>
<!--                    <tr>
                        <td style="text-align:center">类型</td>
                        <td style="padding:5px 10px;">
                        <if condition="$carousel.platform eq 1">
                            <input type="radio" name="platform" value="1" class="type_item" checked>来拍车APP
                            <input type="radio" name="platform" value="2" class="type_item">车来车往APP
                            <input type="radio" name="platform" value="3" class="type_item">车来车往WEB
                            <elseif condition="$carousel.platform eq 2" />
                            <input type="radio" name="platform" value="1" class="type_item">来拍车APP
                            <input type="radio" name="platform" value="2" class="type_item" checked>车来车往APP
                            <input type="radio" name="platform" value="3" class="type_item">车来车往WEB
                            <elseif condition="$carousel.platform eq 3" />
                            <input type="radio" name="platform" value="1" class="type_item">来拍车APP
                            <input type="radio" name="platform" value="2" class="type_item">车来车往APP
                            <input type="radio" name="platform" value="3" class="type_item" checked>车来车往WEB
                        </if>
                        </td>
                    </tr>-->
                    <tr>
                        <td style="text-align:center">排序</td>
                        <td style="padding:5px 10px;" id="sort-list">
                            <ul>
                                <volist name="sort_position" id="sp">
                                    <if condition="$sp.is_have eq 1">
                                        <li><span sort-value="{$sp.position}" class="isHave">{$sp.position}</span></li>
                                        <else />
                                        <li><span sort-value="{$sp.position}">{$sp.position}</span></li>
                                    </if>
                                </volist>
                            </ul>
                            <em style="padding-left:20px;">灰色为已占用</em>
                            <!--<input type="text" name="sort"  value="{$carousel.sort}"  placeholder="请输入排序"  style="width:100px;height:30px;line-height:30px;border:1px solid #ededee;padding-left:5px;">-->
                        </td>
                    </tr>
                    <tr>
                        <td width="10%" style="text-align:center">图片</td>
                        <td width="80%" style="padding:5px 10px;">
                            <if condition="$carousel.share_picture eq ''">
                                <img id="share_pic" src="">
                                <else />
                                <img id="share_pic" src="{$carousel.share_picture}@182w_82h">
                            </if>
                            <script type='text/javascript'>
                                var FrameUploadThumbImgComplete = null;
                                function IFrameUploadThumbImg(txt, upload_url, cb) {
                                    var r = Math.random().toString().split('.')[1];
                                    var id = 'upfrom' + r, input_id = 'file' + r, frm = 'frm' + r;

                                    var html = '<iframe src="" id="' + frm + '" name="' + frm + '" style="display:none;"></iframe><form id="' + id + '" action="' + upload_url + '?script_callback=parent.IFrameUploadThumbImgComplete"  method="POST" enctype="multipart/form-data" target="' + frm + '">\
                <input type="file" id="' + input_id + '" name="pic" class="shangChuan1" />\
                <input type="button" class="genghua" value="' + txt + '" />\
            </form>';
                                    document.write(html);
                                    this.input = $('#' + input_id);
                                    this.input.change(function (e) {
                                        IFrameUploadThumbImgComplete = function (data) {
                                            if (typeof(cb) != 'undefined')
                                                cb(data);
                                        };
                                        var fm = $('#' + id);
                                        fm.action += '&t' + Math.random();
                                        fm.submit();
                                    });
                                };

                                new IFrameUploadThumbImg(
                                    '浏览'
                                    , 'http://' + window.location.host + '/Carousel/uploadPic'
                                    , function (res) {
                                        var cdn_url = 'http:{$t|get_content_cdnurl}';
                                        if (res.code == 200) {
                                            var head_url = res.data[0];
                                            $('#share_pic').attr('src', cdn_url + head_url + '@182w_82h_90Q');
                                            $('#confirm_share_pic').attr('src', cdn_url + head_url + '@182w_82h_90Q');
                                            $('#true_share_pic').attr('src', cdn_url + head_url);
                                        }
                                    });
                            </script>
                        </td>
                    </tr>
                    <tr>
                        <td style="text-align:center">分享内容</td>
                        <td style="padding:5px 10px;">
                            <input type="text" name="share_content"  value="{$carousel.share_content}" placeholder="请输入分享内容" style="width:300px;height:30px;line-height:30px;border:1px solid #ededee;padding-left:5px;">
                        </td>
                    </tr>
                </table>
                <div class='carousel_sub'>
                    <input type='hidden' name='c_id' value='{$carousel.c_id}'>
                    <input type="hidden" value="{$platform}" name="platform">
                    <input type="button" value="确定" name="submit_carousel">
                    <input type="button" value="取消" name="cancel_carousel">
                </div>
            </div>
            <div class="yunBei" style="z-index:999998"></div>
        </div>

        <div class="confirm_page" style="display:none;">
            <h3 class="cha">确认焦点图</h3>
            <div class='carousel'>
                <table width="100%">
                    <tr>
                        <td style="text-align:center">标题</td>
                        <td style="padding:5px 10px;">
                            <div id="title"></div>
                        </td>
                    </tr>
                    <tr style="height:82px;">
                        <td width="10%" style="text-align:center">图片</td>
                        <td width="80%" style="padding:5px 10px;">
                            <img id="confirm_carousel_pic" src="">
                            <img id="true_carousel_pic" src="{$carousel.focus_picture}" style="display: none;">
                        </td>
                    </tr>
                    <tr>
                        <td style="text-align:center">类型</td>
                        <td style="padding:5px 10px;">
                            <div id="type"></div>
                        </td>
                    </tr>
                    <tr>
                        <td style="text-align:center">参数</td>
                        <td id="param" style="padding:5px 10px;"></td>
                    </tr>
                    <tr>
                        <td style="text-align:center">是否登录</td>
                        <td style="padding:5px 10px;">
                            <div id="auth"></div>
                        </td>
                    </tr>
                    <!--   
                    <tr>
                        <td style="text-align:center">平台</td>
                        <td id="platform" style="padding:5px 10px;"></td>
                    </tr>
                    -->
                    <tr>
                        <td style="text-align:center">排序</td>
                        <td style="padding:5px 10px;">
                            <div id="sort" ></div>
                        </td>
                    </tr>
                    <tr style="height:82px;">
                        <td width="10%" style="text-align:center">图片</td>
                        <td width="80%" style="padding:5px 10px;">
                            <img id="confirm_share_pic" src="">
                            <img id="true_share_pic" src="{$carousel.share_picture}" style="display: none;">
                        </td>
                    </tr>
                    <tr>
                        <td style="text-align:center">分享内容</td>
                        <td style="padding:5px 10px;">
                            <div id="share_content"></div>
                        </td>
                    </tr>
                </table>
                <div class='carousel_sub'>
                    <input type='hidden' name='confirm_c_id' value='{$carousel.c_id}'>
                    <input type="button" value="确定" name="confirm_carousel">
                    <input type="button" value="取消" name="cancel_confirm_carousel">
                </div>
            </div>
            <div class="yunBei" style="z-index:999998"></div>
        </div>
    </div>
    <div class="clear"></div>
    <script type="text/javascript">
        $("#sort-list li span").not('.isHave').eq(0).addClass('sortCuur');
        $("#sort-list li span").click(function () {
            if (!$(this).hasClass('isHave')) {
                $("#sort-list li span").removeClass("sortCuur");
                $(this).addClass("sortCuur");
            }
        });
        $('.type_item').change(function () {
            var selValue = $("input[name='type']:checked").val();
            if (selValue == 1) {
                $('#scene').css({display: 'block'});
                $("#scene_sign").hide();
                $("input[name='param_url']").show();
                $('#param_url').css({display: 'none'});
            } else if(selValue == 2) {
                $('#scene').css({display: 'none'});
                $("#scene_sign").hide();
                $("input[name='param_url']").show();
                $('#param_url').css({display: 'block'});
            }else if(selValue == 3){
                $('#scene').css({display: 'none'});
                $("#scene_sign").hide();
                $("input[name='param_url']").hide();
                $('#param_url').css({display: 'none'});
            }
        });
        /**
         * 确定编辑提交
         */
        $("input[name='submit_carousel']").click(function () {
            var c_id = $("input[name='c_id']").val();
            var title = $("input[name='title']").val();
            if (title == '') {
                shibai_alert("抱歉，请输入标题");
                return false;
            }
            $("#title").html(title);
            var focus_pic = $("#carousel_pic").attr("src");
            $("#confirm_carousel_pic").attr("src", focus_pic);
            var type = $("input[name='type']:checked").val();
            if (type == 1) {
                var scene_id = $("select[name='scene_id']").find("option:selected").val();
                var scene_name = $("select[name='scene_id']:visible").find("option:selected").text();
                if (scene_id == undefined) {
                    shibai_alert("保存失败，未选择场次");
                    return false;
                }
            } else if (type == 2) {
                var param_url_reg = /^(\w+:\/\/)?\w+(\.\w+)+.*$/;
                var param_url = $("input[name='param_url']").val();
                if (param_url == '') {
                    shibai_alert("保存失败，未填写参数");
                    return false;
                }
                if (!param_url_reg.test(param_url)) {
                    shibai_alert("保存失败，输入URL参数格式不正确");
                    return false;
                }
            }
            if (type == 1) {
                $("#type").html("拍卖");
                $("#param").html("<div id='scene_id'>" + scene_name + "</div>");
            } else if (type == 2) {
                $("#type").html("活动");
                $("#param").html("<div id='param_url_confirm'>" + param_url + "</div>");
            } else if (type == 3) {
                $("#param").html("");
                $("#type").html("图片");
            }
            $("#type").attr("type-id", type);

            var auth = $("input[name='auth']:checked").val();
            if (auth == 1) {
                $("#auth").html("是");
            } else {
                $("#auth").html("否");
            }

            var platform = $("input[name='platform']").val();
            if (platform == 1) {
                $("#platform").html("来拍车APP");
            } else if (platform == 2) {
                $("#platform").html("车来车往APP");
            } else if (platform == 3) {
                $("#platform").html("车来车往WEB");
            }
            var sort_reg = /^[0-9]*[1-9][0-9]*$/;
            var sort = $(".sortCuur").attr("sort-value");
            if (sort == '') {
                shibai_alert("保存失败，未填写排序");
                return false;
            }
            if (!sort_reg.test(sort)) {
                shibai_alert("保存失败，只能输入正整数");
                return false;
            }
            $("#sort").html(sort);
            var share_pic = $("#share_pic").attr("src");
            $("#confirm_share_pic").attr("src", share_pic);
            var share_content = $("input[name='share_content']").val();
            $("#share_content").html(share_content);

            $(".edit_page").hide();
            $(".confirm_page").show();

        });
        /**
         * 取消编辑
         */
        $("input[name='cancel_carousel']").click(function () {
            window.history.back();
        });
        /**
         * 确定编辑更新
         */
        $("input[name='confirm_carousel']").click(function () {
            var c_id = $("input[name='confirm_c_id']").val();
            var title = $("#title").html();
            var focus_pic = $("#true_carousel_pic").attr('src');
            var type = $("#type").attr('type-id');
            var auth = $("input[name='auth']:checked").val();
            if (type == 1) {
//                scene_id = $("#scene_id").html();
                var scene_id = $("select[name='scene_id']").find("option:selected").val();
            } else {
                var param_url = $("#param_url_confirm").text();
            }
            var sort = $("#sort").html();
            var platform = $("input[name='platform']").val();
            var share_picture = $("#true_share_pic").attr('src');
            var share_content = $("#share_content").html();
            if (type == 1) {
                var params = {
                    "c_id": c_id,
                    "title": title,
                    "focus_picture": focus_pic,
                    "type": type,
                    "auth": auth,
                    "scene_id": scene_id,
                    "platform": platform,
                    "sort": sort,
                    "share_picture": share_picture,
                    "share_content": share_content
                }
            } else if (type == 2) {
                var params = {
                    "c_id": c_id,
                    "title": title,
                    "focus_picture": focus_pic,
                    "type": type,
                    "auth": auth,
                    "param_url": param_url,
                    "platform": platform,
                    "sort": sort,
                    "share_picture": share_picture,
                    "share_content": share_content
                }
            } else if (type == 3) {
                var params = {
                    "c_id": c_id,
                    "title": title,
                    "focus_picture": focus_pic,
                    "type": type,
                    "auth": auth,
                    "platform": platform,
                    "sort": sort,
                    "share_picture": share_picture,
                    "share_content": share_content
                }
            }
            $.post("/Carousel/editCarouselData", params, function (res) {
                if (res.code == 200) {
                    btn_alert(res.msg);
                    setTimeout(function () {
                        window.location.href = "/Carousel/index?p=" + {$p};
                    }, 2000);
                } else {
                    shibai_alert(res.msg);
                }
            }, 'json');
        });
        /**
        * 确定界面取消
        */
       $("input[name='cancel_confirm_carousel']").click(function () {
           $(".confirm_page").hide();
           $(".edit_page").show();
       });
    </script>
    <include file="Public/foot" />
